useEffect

在class component時，分別有三個生命週期componentDidUpdate、componentDidMount、componentWillUnmount這三個階段都可以在一個effect完成

來我們看一段code

import { useEffect } from 'react';

useEffect(() => {
	...someting code
	
	return () => {
		...clear something
	}
} , [dependency])

那如何用useEffect呈現三個生命週期呢！

1. 如何實作DidMount

useEffect(() => {}, []);

假如把dependency設為一個空的陣列(array)這樣就會跟class component裡的componentDidMount一樣只會在dom mount後執行一次

1. 如何實作WillUnmount

useEffect(() => {
	...subscrption something

	return () => {
		...unSubscription something
	}
}, [特殊的ID]);

假如我們在effect裏面return 一個function 他就會在下次DidUpdate時進行清除的動作

以這段程式來說，說訂閱一個特殊Id(叫ID: 9527)，如果下一次要訂閱(ID: 0001)他就會進行清除ID:9527的訂閱．

1. 如何實作DidUpdate

useEffect(() => {}, [depandency]);

這部分重點是dependency，如果依賴值做更改的話，整個effect會重新執行一次來達到componentDidUpdate的功能

再補上useEffect的優化....我再想想有啥例子